import React, {Component} from 'react';
import { connect } from 'dva';
import { Link } from 'dva/router';
import Affix from '../../../../component/Affix';
import styles from './css/Head.css';

class Head extends Component {
	
	render() {
		let {state: {loginSession}, dispatch} = this.props;
		let userOpNode;
		if (loginSession) {
			userOpNode	= (
				<Link className={styles.exit} onClick={() => {
					dispatch({type: 'login/logout'})
				}}>退出</Link>
			)
		} else {
			userOpNode	= (
				<span>
					<Link className={styles.login} to='/login'>登录</Link>
					<Link className={styles.register} to='/register'>注册</Link>
				</span>
			)
		}
		return (
			<Affix>
				<div className={styles.container}>
					<div className={styles.warp + ' head-warp'}>
						<span className={styles.left}>
							<span className={styles.title}>
								用户服务
							</span>
						</span>
						<span className={styles.right}>
							<Link className={styles.item} to='/'>首页</Link>
							<Link className={styles.item}>API接入</Link>
							<Link className={styles.item} to='/system'>管理系统</Link>
							{userOpNode}
						</span>
					</div>
				</div>
			</Affix>
		)
	}
	
}

export default connect(state => ({
	state: {
		...state.loginSession
	}
}))(Head);